import React, {Component, PropTypes} from 'react';
import {message} from 'antd';
import Signals from 'signals';
import styles from './Main.less';
import MenuTreeContainer from '../Tree/MenuTreeContainer';
import BindListContainer from '../List/BindListContainer';
import BindSelectContainer from '../Tree/BindSelectContainer';
import {getSubjectContent} from "../../services/showServer";
import {getTableList} from "../../services/showServer";
import {subBind} from "../../services/showServer";
import {catBind} from "../../services/showServer";
import {getSubTree} from "../../services/showServer";
import {subUnBind} from "../../services/showServer";
import {catUnBindTab} from "../../services/showServer";

class BindMainContainer extends React.Component {
  constructor(props) {
    super(props);
    //signals事件
    this.signal = new Signals.Signal();
    this.bindSignal = new Signals.Signal();
    this.unBindSignal = new Signals.Signal();
    this.listSignal = new Signals.Signal();
    this.listCatSignal = new Signals.Signal();
    this.state = {};
  }

  componentWillMount() {
    this.signal.add(function (point) {
      if (point.type == 1) {
        getSubjectContent(point.id, "all").then(function (json) {
          this.refs.list.setState({
            id: point.id,
            type: point.type,
            data: json,
            path: point.path,
            subname: point.subname,
            catname: point.catname,
          });
        }.bind(this));
      } else {
        getTableList(point.id).then(function (json) {
          this.refs.list.setState({
            id: point.id,
            type: point.type,
            data: json,
            path: point.path,
            subname: point.subname,
            catname: point.catname,
          });
        }.bind(this));
      }
    }.bind(this));

    this.listSignal.add(function (point) {
      this.refs.tree.setState({
        current: point.id,
      });
      getTableList(point.id).then(function (json) {
        this.refs.list.setState({
          id: point.id,
          type: point.type,
          data: json,
          path: point.path,
          catname: point.catname,
        });
      }.bind(this));
    }.bind(this));

    this.listCatSignal.add(function (point) {
      getSubTree().then(function (json) {
        if (json.id) {
          this.refs.tree.setState({
            treeData: json,
            current: point.id,
          });
        }
      }.bind(this));
    }.bind(this));

    this.bindSignal.add(function (selectList) {
      var point = this.refs.tree.state.point;
      if (point.id == 0) {
        message.warning('请选择主题或分类', 2.5);
      } else {
        if (point.type == 1) {
          // 主题中绑定数据
          var data = {
            "id": point.id,
            "ids": selectList
          }

          subBind(data).then(function (res) {
            // 绑定成功后刷新页面数据
            if (res.status == 200) {
              getSubjectContent(point.id, "all").then(function (json) {
                this.refs.list.setState({data: json});
              }.bind(this));

              getSubTree().then(function (json) {
                this.refs.tree.setState({
                  treeData: json
                });
              }.bind(this));
            } else {
              message.error('主题绑定数据错误', 2.5);
            }
          }.bind(this));
        } else {
          // 分类中绑定数据
          var data = {
            "id": point.id,
            "ids": selectList
          }

          catBind(data).then(function (res) {
            // 绑定成功后刷新页面数据
            if (res.status == 200) {
              getTableList(point.id).then(function (json) {
                this.refs.list.setState({data: json});
              }.bind(this));

              getSubTree().then(function (json) {
                this.refs.tree.setState({
                  treeData: json
                });
              }.bind(this));
            } else {
              message.error('分类绑定数据错误', 2.5);
            }
          }.bind(this));
        }

      }
    }.bind(this));

    this.unBindSignal.add(function (selectList) {
      var point = this.refs.tree.state.point;
      if (point.id == 0) {
        message.warning('请选择主题或分类', 2.5);
      } else {
        if (point.type == 1) {
          // 主题中绑定数据
          var data = {
            "id": point.id,
            "ids": selectList
          }
          subUnBind(data).then(function (res) {
            // 解绑成功后刷新页面数据
            if (res.status == 200) {
              getSubjectContent(point.id, "all").then(function (json) {
                this.refs.list.setState({data: json});
              }.bind(this));

              getSubTree().then(function (json) {
                this.refs.tree.setState({
                  treeData: json
                });
              }.bind(this));
            } else {
              message.error('主题解绑数据错误', 2.5);
            }
          }.bind(this));
        } else {
          // 分类中绑定数据
          var data = {
            "id": point.id,
            "ids": selectList
          }

          catUnBindTab(data).then(function (res) {
            // 解绑成功后刷新页面数据
            if (res.status == 200) {
              getTableList(point.id).then(function (json) {
                this.refs.list.setState({data: json});
              }.bind(this));

              getSubTree().then(function (json) {
                this.refs.tree.setState({
                  treeData: json
                });
              }.bind(this));
            } else {
              message.error('分类解绑数据错误', 2.5);
            }
          }.bind(this));
        }

      }
    }.bind(this));
  }

  componentWillUnmount() {
    this.signal.removeAll();
    this.bindSignal.removeAll();
    this.unBindSignal.removeAll();
    this.listSignal.removeAll();
    this.listCatSignal.removeAll();
  }

  render() {
    return (
      <div className={styles.content}>
        <div className={styles.bind_lside}>
          <MenuTreeContainer signal={this.signal} ref="tree"/>
        </div>
        <div className={styles.bind_cside}>
          <BindListContainer signal={this.unBindSignal} listSignal={this.listSignal} listCatSignal={this.listCatSignal} ref="list"/>
        </div>
        <div className={styles.bind_rside}>
          <BindSelectContainer signal={this.bindSignal} ref="select"/>
        </div>
      </div>
    );
  }
}

export default BindMainContainer;
